<template>
	<van-popup :show="isShow" position="bottom" round @click-overlay="$emit('getClose')">
		<view class="p_font_28 p_text_c">
			<view class="p_margin_t_64">请选择上传方式</view>
			<view class="p_color_fe8f0d p_margin_t_24">百度网盘非会员上传速度缓慢，仅建议会员选择</view>
			<view class="modal_content p_margin_tb_48">
				<view class="modal_block" @click="getUpFile">
					<image src="https://dy.sykj365.com/uploads/mini/shangchuan1@2x.png"></image>
					<view class="p_font_26 p_color_7a">本地文件</view>
				</view>
				<view class="modal_block" @click="getWxFile">
					<image src="https://dy.sykj365.com/uploads/mini/shangchuan2@2x.png"></image>
					<view class="p_font_26 p_color_7a">微信上传</view>
				</view>
				<view class="modal_block" data-url="/subpages/imageUpload/imageUpload" @click="skipPage">
					<image src="/static/images/image.png"></image>
					<view class="p_font_26 p_color_7a">图片上传</view>
				</view>
        <view class="modal_block" @click="getBaiduFile">
        	<image src="https://dy.sykj365.com/uploads/mini/shangchuan3@2x.png"></image>
        	<view class="p_font_26 p_color_7a">百度网盘</view>
        </view>
				<view class="modal_block" @click="getPackage">
					<view class="modal_img">
						<image src="https://dy.sykj365.com/uploads/mini/yasuobao.png" class="active"></image>
					</view>
					<view class="p_font_26 p_color_7a">压缩包</view>
				</view>
        <view class="modal_block" data-url="/subpages/otherUpload/otherUpload" @click="skipPage">
        	<image src="/static/images/other.png"></image>
        	<view class="p_font_26 p_color_7a">QQ/WPS</view>
        </view>
				<view class="modal_block" @click="getShare">
					<view class="modal_img">
						<image src="https://dy.sykj365.com/uploads/mini/fenxiangkouling.png"></image>
					</view>
					<view class="p_font_26 p_color_7a">分享清单</view>
					<view class="p_font_24 p_color_b2">点击输入分享口令</view>
				</view>
			</view>
		</view>
	</van-popup>
</template>

<script>
	export default {
		props: {
			isShow: {
				type: Boolean,
				default: false
			},
			cacelShow: {
				type: Boolean,
				default: false
			}
		},
		data() {
			return {
				listData: [],
				index: 0,
				timer: null,
				type: '',
			}
		},
		methods: {
			getUpFile() {
				this.$emit('getClose');
				getApp().getNavigateTo('/pages/index/bendiFile');
			},
			getWxFile() {
				let self = this;
				uni.chooseMessageFile({
					count: 9,
					type: 'file',
					// extension: ['doc', 'docx', 'pdf', 'pptx', 'ppt'],
					extension: ['pdf', 'docx', 'doc', 'pptx', 'ppt'],
					success: function(res) {
						let files = res.tempFiles;
						self.listData = files;
						self.index = 0;
						self.getFileUp(files[self.index]);
					}
				})
			},
			getBaiduFile() {
				this.$emit('getClose');
				getApp().getNavigateTo('/pages/index/baidu');
			},
			getShare() {
				this.$emit('getClose');
				getApp().getNavigateTo('/pages/index/shareInput');
			},
			getPackage() {
				this.$emit('getClose');
				getApp().getNavigateTo('/pages/index/package');
			},
      // 跳转页面
      skipPage(e) {
        uni.navigateTo({
          url: e.currentTarget.dataset.url,
          success: () => {
            this.$emit('getClose');
          }
        })
      },
			getFileUp(e) {
				let self = this;
				let arr_ = e.name.split('.');

				if (e.size / 1024 / 1024 > 500) {
					getApp().getMsg('文件最大不超过500M');
					
					if(self.index < self.listData.length - 1) {
						self.index = self.index + 1;
						self.getFileUp(files[self.index]);
					}
					
					return;
				}

				uni.showLoading();
				if (arr_[arr_.length - 1] === 'pdf' || arr_[arr_.length - 1] === 'PDF') {
					self.$emit('getLoading', e.name);
				} else {
					self.$emit('getLoadWord', e.name);
				}

				self.type = arr_[arr_.length - 1];

				const uploadTask = uni.uploadFile({
					url: self.$api.upload,
					filePath: e.path,
					name: 'file',
					header: {
						"Content-Type": "multipart/form-data",
					},
					formData: {},
					success: (uploadFileRes) => {
						let result = JSON.parse(uploadFileRes.data);

						if (result.code === 20000) {
							if (self.type === 'pdf' || self.type === 'PDF') {
								self.$emit('getSuccess', result.data);
							} else {
								self.getWordId(result.data, self.listData[self.index]);
							}
						} else {
							self.$emit('getErros', e.name);
						}
					},
					fail(e) {
						console.log(e)
						self.$emit('getErros', e.name);
					}
				});

				uploadTask.onProgressUpdate((res) => {
					console.log('上传进度' + res.progress);

					if (self.cacelShow) {
						uploadTask.abort();
					}

					if (!self.cacelShow && (self.type === 'pdf' || self.type === 'PDF')) {
						self.$emit('getPross', res.progress);
					}
				});
			},
			// word转pdf
			getWordId(res, e) {
				let self = this;
				let s_u = res.url;
				
				if (e.size / 1024 / 1024 > 2) {
					uni.showLoading({
						title: '文件较大解析需要时间，请稍等'
					})
				}
				
				this.$http.post(this.$api.wordToPdf, {
					file: res.url
				}, true, true).then(res => {
					if (res.code === 20000) {
						res.data.source_file = s_u;
						self.$emit('getSuccess', res.data);
					} else {
						self.$emit('getErros', e.name);
					}
				})
			},
			//
			getChooseFiles() {
				console.log(this.index)
				console.log(this.listData)
				let self = this;
				if(self.index < self.listData.length - 1) {
					self.index = self.index + 1;
					self.getFileUp(self.listData[self.index]);
				}
			}
		}
	}
</script>

<style lang="less">
	.modal_wrapper {
		text-align: center;
	}

	.modal_content {
		display: flex;
		flex-wrap: wrap;
		// justify-content: space-around;
	}

	.modal_block {
		width: 33.33%;
		text-align: center;
		margin: 30rpx 0;

		image {
			width: 112rpx;
			height: 112rpx;
			margin: 0 auto 16rpx;
		}
	}

	.modal_img {
		width: 112rpx;
		height: 112rpx;
		border-radius: 50%;
		margin: 0 auto 16rpx;
		background-color: #f3f3f3;
		display: flex;
		align-items: center;
		justify-content: center;

		image {
			width: 70%;
			height: 70%;
			margin: 0;
			
			&.active {
				width: 50%;
				height: 50%;
				margin: 0;
			}
		}
	}
</style>